<template>
  <div class="q1">
    <Area
      title="选择省市"
      @cancel="cancel"
      @confirm="confirm"
      :area-list="areaList"
      :columns-num="2"
    />
    <!-- @confirm="confirmBtn"	// 当点击右上方完成时 (这里不用写()和实参，我就是碰了这个坑，导致或取不到选中的信息) -->
    <!-- {{ areaList }} -->
  </div>
</template>
<script setup>
import { ref } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { Area, Button } from 'vant'
import { areaList } from '@vant/area-data'

import useApp from '../../global/app' //引入全局状态数据
const appData = useApp() //使用
// const city = appData.selectedcity
const { replace } = useRouter()
const cancel = () => {
  router.go(-1)
  // replace({
  //   name: 'Home'
  // })
}
const route = useRoute()
const router = useRouter()
const tid = route.query.tid
console.log(tid) //使用go(-1)跳转不需要tid判断，replace需要

const confirm = (res, index) => {
  console.log(res, index)
  console.log(res[1].name)
  appData.rename(res[1].name)
  router.go(-1)
  // if (tid == 1) {
  //   replace({
  //     name: 'Home'
  //   })
  // }
}

const ar = ref(areaList)
console.log(areaList)
</script>
